<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/login.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./../font/iconfont.css">
</head>
<body>
    <div class="wrap">
        <div class='header-top fr' id="dingbu">
            <div class="topbar-en fr" style="margin-right:30px;" >
                <a href="#" title="语言">EN</a>
             </div>
            <div class="topbar-service fr" style="margin:0 30px;" >
                <a href="#" title="在线客服"><i class="iconfont">&#xe677;</i></a>
             </div>
            <div class="topbar-cart fr" style="margin-left:30px;">
                <a href="./page5.html" title="购物车"><i class="iconfont">&#xe60a;</i></a>
            </div>
            
            <div class="topbar-user fr">
                <a href="./login.html" title="登入">登入</a>
                &nbsp;或 &nbsp;
                <a href="./login.html" title="注册">注册</a>
                &nbsp;ANTA会员
            </div>
        </div>
        <!-- --------------------第一部分结束 -->
        <div class="header-nav fl">
            <div class="main">
            <div class="header-logo fl">  
                <div class="logo-inner">
                    <a href="./page1.html">
                      <img src="https://img.fishfay.com/theme/images/logo/logo-anta-r-02.svg" alt=""></a>
                </div>
            </div>
            <!-- -------------二级菜单开始 -->
        
         <div class="nav-list fl">
            <ul class="back1">
            <li class="webnav fl">
                <a href="./page3.html" >男子</a>
                <ol class="webnav-box1"> 
                    <li>
                        <dl class="webnav-box2">  
                            <dt class="orange">所有鞋类</dt>
                            <dd>运动鞋 </dd>
                            <dd>跑鞋</dd>
                            <dd>篮球鞋</dd>
                            <dd>所有鞋类</dd>
                            <dd>运动鞋</dd>
                            <dd>跑鞋</dd>
                            <dd>篮球鞋</dd>
                        </dl>
                    </li>
                    <li>
                        <dl class="webnav-box3">  
                            <dt class="orange">所有服装</dt>
                            <dd>套头卫衣</dd>
                            <dd>套头卫衣</dd>
                            <dd>套头卫衣</dd>
                            <dd>套头卫衣</dd>
                        </dl>
                    </li>
                    <li>
                        <dl class="webnav-box4">  
                            <dt class="orange">所有配件</dt>
                            <dd>运动鞋</dd>
                            <dd>跑鞋</dd>
                            <dd>篮球鞋</dd>
                            <dd>所有鞋类</dd>
                            <dd>运动鞋</dd>
                            <dd>跑鞋</dd>
                            <dd>篮球鞋</dd>
                        </dl>
                    </li>
                    <li>
                        <dl class="webnav-box5">  
                            <dt class="orange">运动项目</dt>
                            <dd>运动鞋</dd>
                            <dd>跑鞋</dd>
                            <dd>篮球鞋</dd>
                            <dd>所有鞋类</dd>
                            <dd>运动鞋</dd>
                            <dd>跑鞋</dd>
                            <dd>篮球鞋</dd>
                        </dl>
                    </li>
                </ol>
            </li>
            <li class="back1-box1">
                <a href="./page3.html">女子</a>
            </li>
            <li data-type="kids" class="back1-box1">
                <a href="./page3.html" target="_blank" title="儿童">儿童</a>
            </li>
            <li data-type="antakids" class="back1-box1">
                <a href="./page3.html" target="_blank" title="安踏儿童">安踏儿童</a>
            </li>
            <li data-type="culture" class="back1-box1">
                <a href="./page3.html" target="_blank" title="品牌文化">品牌文化</a>
            </li>
            <li data-type="advert" class="back1-box1">
                <a href="./page3.html" target="_blank" title="观赏视频">观赏视频</a>
            </li>
            <li data-type="contact" class="back1-box1">
                <a href="./page3.html" target="_blank" title="联系我们">联系我们</a>
            </li>
         </ul> 
        </div>
           <!-- 搜索框 -->
            <div class="nav-search-box fr">
                    <a class="nav-search-btn" title="搜索"><i class="iconfont">&#xe649;</i></a>
                    <input type="text"  placeholder="搜索" class="nav-search-input">
           </div>
       </div>
    </div>
    <!-- ----------------------正式内容---------------------- -->
    <div class="main">
        <div class="back2 fl">
            <div class="back2-box1">
                <form action="# fl">
                    <input type="text" name="user" placeholder="邮箱/手机号码/安踏帐号" class="po"><span></span>
                    <br/>
                    <input type="text" name="pass" placeholder="密码" class="ps"><span></span>
                    <br/>
                    <a href="./page1.html" class="deng"><h6>立即登录</h6></a>
                    
                </form>
                <div class="back2-box2 fl">
                       <h4>其他方式登录</h4>
                       <a ><i class="iconfont">&#xe6a1;</i></a>
                       <a><i class="iconfont">&#xe6a1;</i></a>
                       <a ><i class="iconfont">&#xe6a1;</i></a>
                       <ul>
                           <li>账号注册</li>
                           <li>忘记密码</li>
                       </ul>
                </div>
               
            </div>

        </div>
    </div>
   <!-- ----------------------结尾------------ -->
   <div class="main">
    <div class="back10 fl">
        <div class="ft-slogan fl">
            <img src="https://img.fishfay.com/theme/images/logo/slogan-anta-r.svg" alt="" >
        </div>
       <div class="back10-box">
               <ul class="back10-box1">
                   <li>安踏海外</li>
                   <li>|</li>
                   <li>安踏投资者关系</li>
               </ul>
               <ul class="back10-box2">
                    <li>Copyright(C) 2020 by www.ANTA.com</li>
                    <li>©安踏体育用品有限公司版权所有</li>
                    <li>营业执照</li>
                    <li>开户许可证</li>
                    <li>闽ICP备11020421号</li>
                    <li>闽公网安备35058202000423号</li>
                </ul>
                <ul class="back10-box3">
                    <li>安踏儿童</li>
                    <li>|</li>
                    <li>Fila</li>
                    <li>|</li>
                    <li>Kolon Sport</li>
                    <li>|</li>
                    <li>Descente</li>
                    <li>|</li>
                    <li>Sprandi</li>
                    <li>|</li>
                    <li>Kingkow</li>
                </ul>
       </div>
    </div>
</div>
     <!-- ------------------------侧边栏--------------- -->
     <div class="web-covers">
        <a href="#dingbu"></a>
        <a href="./page5.html" title="购物车" class="cart"></a> 
    </div> 
</div>
<script src="./js/lib/jquery-1.8.3.js"></script>
<script src="./js/login.js"></script>

<!-- <script>
    //获取所有操作对象
    var frm=document.querySelector("form")
    var spans=document.querySelectorAll("span")
    var inputs=document.querySelectorAll(".po")
    var pass=document.querySelector(".ps")
    var btn = document.querySelector(".deng")
    var user1=false  //表示账号是否验证成功
    //给账号绑定失去焦点事件
    inputs[0].onblur=function(){
        //获取输入框的value值
        var val=this.value
        var reg=/^\w{6,16}$/
        if(reg.test(val)){
            spans[0].innerHTML="√"
            user1=true
        }else{
            spans[0].innerHTML="×"
            user1=false
            //让当前输入框重新获取焦点
            this.focus()
        }
    }
    var pass1=false 
    //密码的验证
    inputs[1].onblur=function(){
        var val=this.value
        var reg=/^\w{6,16}$/
        if(reg.test(val)){
            spans[1].innerHTML="√"
            pass1=true
        }else{
            spans[1].innerHTML="×"
            pass1=false
            //让当前输入框重新获取焦点
            this.focus()
        }
    }
    //给form表单绑定提交事件
    frm.onsubmit=function(){
        if(user1 && pass1 ){
            return true
        }else{
            inputs[0].onblur()
            inputs[1].onblur()
            inputs[2].onblur()
            return false
        }
        
    }
    btn.click(function () {
    var username = inputs.val()
    var password = pass.val()
    console.log(username);
    if (username == "" || password == "") {
        alert('账号密码不能为空！')
        return false
    } 
})
</script> -->
</body>
</html>